/* eslint-disable */
/**
 * Created by GYL on 2018/7/25
 */
import React, { Component } from 'react';
import { Tabs ,Form,Row,Tooltip,Input,Select,DatePicker,TreeSelect} from 'antd';
import config from '../../../../config';
import Util from '../../../../utils/Util';
const { TextArea } = Input;
const FormItem = Form.Item;
const { SHOW_CHILD } = TreeSelect;
import request from '../../../../utils/request';
import moment  from 'moment';
class Small_Tab2 extends Component {
    componentDidMount() {
        console.log(this.props)
        request({
            url: '/pm-web/projectmanage/progress/projectBasicInformation',
            method: 'POST',
            data:{eventId:this.props.id}
        }).then(data => {
            console.log(data)
            if(data.rc === 0) {
                this.setState({
                    arr:[
                        {
                            type: 'select',
                            paramName: 'eventAttribute',
                            id: 'eventAttribute',
                            key: "eventAttribute",
                            label: '事件属性',
                            rules: [{ ...config.reg.required }],
                            style: { width: 200 },
                            span: 24,
                            rows: 1,
                            colSpan: 24,
                            disabled: true,
                            placeholder: '请选择',
                            initialValue: data.ret.eventAttribute,
                            options: [
                                { text: '必选项', value: 1 },
                                { text: '非必选项', value:2 },
                               
                            ]
                        },
                        {
                            type: 'select',
                            paramName: 'eventStage',
                            id: 'eventStage',
                            key: "eventStage",
                            label: '事件阶段',
                            rules: [{ ...config.reg.required }],
                            style: { width: 200 },
                            span: 24,
                            rows: 1,
                            colSpan: 24,
                            placeholder: '请选择',
                            disabled: true,
            
                            initialValue: data.ret.eventStage,
                            options: [
                                { text: '项目前期', value: 1 },
                                { text: '项目实施', value: 2 },
                                { text: '项目验收', value: 3 },
                                { text: '项目结算', value: 4 },
                               
                            ]
                        },
                      
                        {
                            type: 'TextArea',
                            paramName: 'eventDescribe',
                            id: 'eventDescribe',
                            title: '最多显示30个字',
                            num: 30,
                            key: "eventDescribe",
                            label: '事件说明',
                            style: { width: 550 },
                            rules: [{ ...config.reg.required }],
                            span: 24,
                            rows: 2,
                            colSpan: 24,
                            initialValue: data.ret.eventDescribe,
                            disabled: true
            
                        },
            
                         {
                            type: 'datePicker',
                            label: '计划开始时间',
                            paramName: 'planStartTime',
                            initialValue: data.ret.planStartTime?moment(data.ret.planStartTime):'',
                            rules: [{ ...config.reg.required }],
                            style: { width: 200 },
                            rules: [{ ...config.reg.required }],
                            span: 24,
                            rows: 1,
                            colSpan: 24,
                            disabled: true,
                        },
                        {
                            type: 'datePicker',
                            label: '计划结束时间',
                            paramName: 'planEndTime',
                            initialValue: data.ret.planEndTime?moment(data.ret.planEndTime):'',
                            rules: [{ ...config.reg.required }],
                            style: { width: 200 },
                            rules: [{ ...config.reg.required }],
                            span: 24,
                            rows: 1,
                            colSpan: 24,
                            disabled: true,
                        },
                        {
                            type: 'input',
                            paramName: 'workTime',
                            id: 'workTime',
                            title: '最多显示200个字',
                            num: 30,
                            key: "workTime",
                            label: '工期',
                            style: { width: 100, height: 20 },
                            disabled: true,
                            span: 24,
                            rows: 1,
                            colSpan: 24,
                            initialValue:data.ret.workTime,
            
                        },
                       
                    ]
                })
            }
        })
    }

    state = {
        arr:[]
    }

    render() {
        let { getFieldDecorator } = this.props.form;
        let t = this;
        return (
            <div style={{ height: "70vh", overflow: 'auto' }}>
                <Form layout={'inline'} style={{ padding: 40 }} >
                    <Row gutter={48} key={55555}>
                        {
                            this.state.arr.map((item, index) => {
                                if (item.type === 'TextArea') {
                                    return (
                                        // <Col span={item.span} key={index}>
                                        <Form.Item label={item.label} key={item.paramName} className={item.className} style={{ ...item.style }} labelCol={{ span: item.span }} wrapperCol={{ span: item.colSpan ? item.colSpan : 14 }}>
                                            <Tooltip
                                                trigger={['focus']}
                                                title={item.title}
                                                placement="topLeft"
                                                overlayClassName="numeric-input"
                                            >
                                                {
                                                    getFieldDecorator(item.paramName, {
                                                        initialValue: item.initialValue ? item.initialValue : '',
                                                        rules: item.rules || null
                                                    })(

                                                        <TextArea
                                                            style={item.style}
                                                            placeholder={item.placeholder}
                                                            // onChange={this.onChange}
                                                            rows={item.rows}
                                                            maxLength={item.num}
                                                            disabled={item.disabled} id={[item.paramName]}
                                                          size={config.size} style={item.style}
                                                        />

                                                    )
                                                }
                                            </Tooltip>
                                        </Form.Item>
                                        // </Col>
                                    )
                                } else if (item.type === 'input') {
                                    return (

                                        <Form.Item label={item.label} key={item.paramName} className={item.className} style={{ ...item.style }} labelCol={{ span: item.span }} wrapperCol={{ span: item.colSpan ? item.colSpan : 14 }}>
                                            {
                                                getFieldDecorator(item.paramName, {
                                                    initialValue: item.initialValue ? item.initialValue : '',
                                                    rules: item.rules || null
                                                })(
                                                    <input
                                                        style={item.style}
                                                        type='number'
                                                        disabled={item.disabled} id={[item.paramName]}
                                                         size={config.size} style={item.style}
                                                    />
                                                )
                                            }
                                        </Form.Item>

                                    )
                                } else if (item.type === 'select') {
                                    return (

                                        <Form.Item label={item.label} key={item.paramName} className={item.className} style={{ ...item.style }} labelCol={{ span: item.span }} wrapperCol={{ span: item.colSpan ? item.colSpan : 14 }}>
                                            {
                                                getFieldDecorator(item.paramName, {
                                                    initialValue: item.initialValue ? item.initialValue : (item.options[0] ? Util.numToString(item.options[0].value) : item.options[0]),
                                                    rules: item.rules || null
                                                })(
                                                    <Select
                                                        size={config.size}
                                                        showSearch
                                                        mode={item.mode}
                                                        placeholder="Select a person"
                                                        style={{ width: item.width || 170 }}
                                                        optionFilterProp="children"
                                                        dropdownMatchSelectWidth={t.props.dropdownMatchSelectWidth}
                                                      
                                                      
                                                        disabled={item.disabled}
                                                    >
                                                        {
                                                            item.options.map(option => {
                                                                return (
                                                                    <Select.Option key={option.value}
                                                                        value={Util.numToString(option.value)}
                                                                    >
                                                                        {option.text}
                                                                    </Select.Option>

                                                                )
                                                            })
                                                        }
                                                    </Select>
                                                )
                                            }
                                        </Form.Item>

                                    )
                                } else if (item.type === 'datePicker') {
                                    let disabled = item.disabledDate ? disabledDate : null;
                                    return (
                                        <Form.Item label={item.label} key={item.paramName} className={item.className} style={{ ...item.style }} labelCol={{ span: item.span }} wrapperCol={{ span: item.colSpan ? item.colSpan : 14 }}>
                                            {
                                                getFieldDecorator(item.paramName, {
                                                    initialValue: item.initialValue ? item.initialValue : null,
                                                    rules: item.rules || null
                                                })(
                                                    <DatePicker size={config.size} disabledDate={disabled} disabled={item.disabled} />
                                                )
                                            }
                                        </Form.Item>)
                                } else if (item.type === 'treeSelect') {
                                    return (

                                        <Form.Item label={item.label} key={item.paramName} className={item.className} style={{ ...item.style }} labelCol={{ span: item.span }} wrapperCol={{ span: item.colSpan ? item.colSpan : 14 }}>
                                            {
                                                getFieldDecorator(item.paramName, {
                                                    initialValue: item.initialValue ? item.initialValue : null,
                                                    rules: item.rules || null
                                                })(
                                                    <TreeSelect
                                                        disabled={item.disabled}
                                                        treeData={item.treeData}
                                                    
                                                        treeCheckable={item.treeCheckable}
                                                        showCheckedStrategy={SHOW_CHILD}
                                                        searchPlaceholder={'请选部门'}
                                                    />
                                                )
                                            }
                                        </Form.Item>

                                    )
                                } else if (item.type === 'title') {
                                    return (
                                        <Row key={item.name}>
                                            <h2 style={{ fontSize: 14, fontWeight: 700 }}><span style={{ borderTopLeftRadius: 3, borderTopRightRadius: 3, padding: 1, color: "#fff", backgroundColor: "#03a9f4" }}> {item.name}</span></h2>

                                            {/* <div style={{ width: "100%", borderBottom: "1px solid #ccc",marginBottom:10 }}></div> */}
                                        </Row>


                                    )
                                } else if (item.type === 'arr') {
                                    return (
                                        item.list.map((item, index) => {
                                            if (item.type === 'TextArea') {
                                                return (
                                                    <Form.Item label={item.label} key={item.paramName} className={item.className} style={{ ...item.style }} labelCol={{ span: item.span }} wrapperCol={{ span: item.colSpan ? item.colSpan : 14 }}>
                                                        <Tooltip
                                                            trigger={['focus', 'hover']}
                                                            title={item.title}
                                                            placement="topLeft"
                                                            overlayClassName="numeric-input"
                                                        >
                                                            {
                                                                getFieldDecorator(item.paramName, {
                                                                    initialValue: item.initialValue ? item.initialValue : '',
                                                                    rules: item.rules || null
                                                                })(

                                                                    <TextArea
                                                                        style={item.style}
                                                                        placeholder={item.placeholder}
                                                                        // onChange={this.onChange}
                                                                        rows={item.rows}
                                                                        maxLength={item.num}
                                                                        disabled={item.disabled} id={[item.paramName]}
                                                                      
                                                                    />

                                                                )
                                                            }
                                                        </Tooltip>
                                                    </Form.Item>
                                                )
                                            }

                                        })


                                    )
                                } else if (item.type === 'button') {
                                    return (
                                        <button onClick={this.addListfx}>新增</button>
                                    )
                                }

                            })
                        }

                    </Row>
                </Form>
            </div>
        )
    }
}

export default Form.create()(Small_Tab2);
